<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>注册</title>
    <script src="jquery-1.9.1.min.js"></script>
    <script>
        function mysub(type) {
            //拿到控件的值
            var username = jQuery("#username");
            var password = jQuery("#password");
            var password2 = jQuery("#password2");
            if (type == 2) {
                //取消（清空）
                if (confirm("确认取消?")) {
                    username.val("");
                    password.val("");
                    password2.val("");
                }
                return false;
            }
            //type == 1
            //非空校验
            if (username.val().trim() == "") {
                alert("请输入用户名！");
                username.focus();//将光标移到当前输入框
                return false;
            }
            if (password.val().trim() == "") {
                alert("请输入密码！");
                password.focus();//将光标移到当前输入框
                return false;
            }
            if (password2.val().trim() == "") {
                alert("请确认密码！");
                password2.focus();//将光标移到当前输入框
                return false;
            }
            if (password.val() != password2.val()) {
                alert("请检查两次密码是否输入一致!");
                password.focus();
                return false;
            }

            //使用ajax请求后端接口
            jQuery.getJSON("reg", {
                "username": username.val(),
                "password": password.val()
            }, function (res) {
                if (res != null && res.succ == 1) {//succ==1表示操作成功
                    alert("注册成功!");
                    location.href = "log.html";
                } else {
                    alert("注册失败!" + res.msg);//打印信息
                }
            });
        }
    </script>
</head>
<body style="background-image: url(b1.jpg);background-repeat: no-repeat;background-size: 100% auto">
<div style="text-align: center;margin-top: 80px;background-color: lavenderblush;opacity:0.6;">
    <h1>注册</h1>
    用&ensp;户&ensp;名：<input id="username" name="username" type="text">
    <p></p>
    密&ensp;&ensp;&ensp;&ensp;码：<input id="password" name="password" type="password">
    <p></p>
    确认密码：<input id="password2" name="password2" type="password">
    <p></p>
    <a href="log.html">已有账号 直接登录</a>
    <p></p>
    <input type="button" value="确 定" onclick="mysub(1)">
    <input type="button" value="取 消" onclick="mysub(2)">
</div>
</body>
</html>